import React, { useEffect, useState } from "react";

import { Form, Input, Button, Select, Table, Space } from "antd";
import api from '../../../../api'
const { Option } = Select;

const Sale = () => {
  let [data, setData] = useState([])
  useEffect(() => {
    getData()
  }, [])
  const getData = async () => {
    const { data: res } = await api.getResourceTable()
    res.data = res.data.filter(item => {
      return item.key = item.HouseID
    })
    setData(res.data)
  }
  const columns = [
    {
      title: '序号',
      dataIndex: 'HouseID',
      key: 'HouseID',
      align: "center",
    },
    {
      title: '楼盘名称',
      dataIndex: 'HouseName',
      key: 'HouseName',
      align: "center",
    },
    {
      title: '详细地址',
      dataIndex: 'HouseAddress',
      key: 'HouseAddress',
      align: "center",
    },
    {
      title: '价格',
      key: 'HousePrice',
      dataIndex: 'HousePrice',
      align: "center",
    },
    {
      title: '排序',
      dataIndex: 'sort',
      key: 'sort',
      align: "center",
    },
    {
      title: '更新时间',
      dataIndex: 'HouseTime',
      key: 'HouseTime',
      align: "center",
    },
    {
      title: '状态',
      dataIndex: 'status',
      key: 'status',
      align: "center",
    },
    {
      title: '经纪人',
      key: 'middleman',
      dataIndex: 'middleman',
      align: "center",
    },
    {
      title: '操作',
      key: 'action',
      align: "center",
      render: (text, record) => (
        <Space size="middle">
          <Button type='link'>详情</Button>
          <Button type='link'>编辑</Button>
          <Button type='link'>删除</Button>
          <Button type='link'>指派经纪人</Button>
        </Space>
      ),
    },
  ];
  const [form] = Form.useForm();
  // select改变
  const onGenderChange = () => { };

  // 搜索
  const onFinish = (values) => {
    console.log(values);
  }
  return (
    <div className="sale">
      <Form layout="inline" form={form}
        onFinish={onFinish} autoComplete="off">
        <Form.Item>
          <Select placeholder="请选择省份" onChange={onGenderChange} allowClear>
            <Option value="male">山西省</Option>
            <Option value="female">湖南省</Option>
            <Option value="other">广东省</Option>
          </Select>
        </Form.Item>
        <Form.Item>
          <Select placeholder="请选择城市" onChange={onGenderChange} allowClear>
            <Option value="male">运城市</Option>
            <Option value="female">怀化市</Option>
            <Option value="other">深圳市</Option>
          </Select>
        </Form.Item>
        <Form.Item>
          <Select placeholder="请选择区县" onChange={onGenderChange} allowClear>
            <Option value="male">盐湖区</Option>
            <Option value="female">耀县</Option>
            <Option value="other">南山区</Option>
          </Select>
        </Form.Item>
        <Form.Item>
          <Input placeholder="关键字" />
        </Form.Item>
        <Form.Item>
          <Button type="primary" htmlType="submit">搜索</Button>
        </Form.Item>
      </Form>
      <div className="sale_main">
        <Button type='primary' >新增</Button>
        <Table columns={columns} dataSource={data} />
      </div>
    </div>
  );
};

export default Sale;
